<seed-content #content class="default-bg">
  <seed-toolbar-header>
    <seed-toolbar-title>确认订单</seed-toolbar-title>
    <seed-toolbar-menu></seed-toolbar-menu>
  </seed-toolbar-header>
  <!--地址栏-->

  <div class="seed-order-detail-warp order-confirm-box">
    <div class="addr-box" (click)="goToAddressList()" *ngIf="goodsCateCode1!='V20'">
      <div class="addr-content" *ngIf="hasAddress">
        <div class="name">
          <span>收货人：</span>
          <span>{{defaultAddress.consignee}}</span>
          <span class="default" *ngIf="defaultAddress.isDefaultAddress==1">默认</span>
          <span class="phone">{{defaultAddress.mobile}}</span>
        </div>
        <div class="addr-detail">
          <span>收货地址：</span>
          <span>{{defaultAddress['provName']}}{{defaultAddress.cityName}}{{defaultAddress.distName}}{{defaultAddress.detailAddress}}</span>
        </div>
      </div>
      <div class="addr-content" *ngIf="!hasAddress">
        <div class="name">
          <span>请选择收货地址</span>
        </div>
      </div>
      <p class="addr-icon">
      </p>
    </div>
    <!--订单信息-->
    <div class="order-info">
      <p class="order-title" *ngIf="goodsSkuDetail">
        <img [src]="goodsSkuDetail?.thirdPatternIconUrl" seed-load-img>
        <span>{{goodsSkuDetail?.thirdPatternNickname }}</span>
      </p>
      <div class="order-content">
        <p class="content-img">
          <seed-img *ngIf="goodsSkuDetail?.imgList" [lazyLoadImg]="goodsSkuDetail?.imgList[0]?.goodsLargeUrl"
                    [background]="true" [defaultImg]="'middle'"> </seed-img>
        </p>
        <div class="content-name">
          <div>{{goodsSkuDetail?.goodsName}}</div>
        </div>
        <div class="content-price">
          <p class="price">￥{{goodsSkuDetail?.salePrice | twoDotPrice}}</p>
          <p class="num"><span></span>{{goodsQuantity}}</p>
        </div>
      </div>
      <div class="simple-count">
        共<span class="num bcolor">{{goodsQuantity}}</span>件商品,小计：
        <span class="price bcolor">￥{{(goodsSkuDetail?.salePrice * goodsQuantity) | twoDotPrice}}</span>
      </div>
    </div>
    <!--支付方式-->
    <seed-item class=" seed-item-block seed-underline pay-type" (click)="modal1.show()"
               *ngIf=" goodsSkuDetail?.salePrice !== 0 && !haggleAmount ">
      <span>优惠券</span>
      <span class="seed-flexbox coupons-amount seed-flexbox-align-center" >
        <i *ngIf="!choose">
          {{ couponTotal? couponTotal: 0 }} 张可用
          <seed-icon color="c4" name="icon-arrow-right"></seed-icon>
        </i>
        <i *ngIf="choose"> -￥{{ couponValue | twoDotPrice }} </i>
      </span>
    </seed-item>

    <div class="pay-type border-bottom-scaleY" *ngIf="haggleAmount">
      <span>活动优惠</span>
      <span>-￥{{ haggleAmount?(haggleAmount| twoDotPrice):0.00}}</span>
    </div>
    <div class="pay-type">
      <span>支付方式</span>
      <span>在线支付</span>
    </div>
  </div>

  <!--确认-->
  <div class="btn-wrap-confim-order seed-scroll-outside"  #btnWrap id="btn-wrap" >
    <p class="p-info">
      共<span class="num bcolor">{{goodsQuantity}}</span>
      件商品，合计：
      <span class="price bcolor">￥{{totalPrice | twoDotPrice}}</span>
      <!--<span class="dian bcolor">{{(totalPrice * goodsQuantity) | decimalPrice}}</span>-->
    </p>
    <div class="sub-btn-pay">
      <button  (click)="postSubmitOrder()" [ngClass]="{'disabled':!canClick}">
        确认支付
      </button>
    </div>
  </div>

  <!--领取优惠券-->
  <seed-modal #modal1 [content]="content" >
    <div class="seed-coupon-choose seed-modal-content seed-flexbox seed-flexbox-column">
      <seed-toolbar-header>
        <seed-toolbar-title>选择优惠券</seed-toolbar-title>
        <seed-toolbar-menu></seed-toolbar-menu>
        <em class="coupon-explain" (click)="goToCouponExplain()"></em>
      </seed-toolbar-header>

      <seed-infinite-scroll >

        <div class="couponList" *ngFor="let coupon of usableCouponList; let i = index;">
          <seed-coupon-card [coupon]="coupon" class="seed-modal-content" [markType]="2" [choose]="i === cardChooseIndex"
                            (goToDetail)="chooseCoupon( coupon.codeId, coupon.couponValue, i )" >

          </seed-coupon-card>
        </div>
        <seed-infinite-scroll-content class="load-bg" *ngIf="usableCouponList.length > 5"></seed-infinite-scroll-content>
      </seed-infinite-scroll>
      <missing-default-content *ngIf="usableCouponList.length==0"></missing-default-content>
    </div>
  </seed-modal>

</seed-content>


